<template>
    <el-tag class="tag_item" @click="select"
            :type="isSelect?'':'info'"
            closable
            @close="closeTag()">
        {{tagItem.title?tagItem.title:'NewTag'+index}}
    </el-tag>
</template>

<script>
    export default {
        name:"TagItem",
        props:{
            tagItem:{},
            index:{}
        },
        data() {
            return {
            };
        },
        computed:{
            isSelect:{
                get(){
                    return this.$route.path.indexOf(this.tagItem.path) !== -1
                }
            }
        },
        methods:{
            select(){
                this.$router.push(this.tagItem.path)
            },
            closeTag(){
                this.$emit('removeTags',this.index)
            }
        },
        mounted() {
        }
    }
</script>
<style>
    .tag_item{
        margin-left: 10px;
        height: 30px;
        line-height: 30px;
    }

</style>
